import React from 'react';
import { connect } from 'dva';
import { Modal, ActivityIndicator } from 'antd-mobile';
import { routerRedux } from 'dva/router';
import content from '../../../../common/contentCss/content.css';
import styles from './common.css';
import CustTitle from '../../../../common/title/title';
import { createForm } from 'rc-form';
import WithdrawCash from './pages/withdrawCash';
import NoTitleAlert from '../../../../../../common/alert/noTitleAlert/noTitleAlert';
import IsCommitAlert from './pages/isCommitAlert/isCommitAlert';

const alert = Modal.alert;
const commitAlert = Modal.alert;

function Index({loading, dispatch, withdrawCash}) {

  const { cash, messageTips, isShowTips } = withdrawCash;

  const withdrawCashProps = {
    money:cash,
    onSubmit(data){
      console.log('data', JSON.stringify(data));
      // onOkCommit();
      isCommit(data);

    },
    goBack(){
      dispatch(routerRedux.goBack());
    }
  }

  const onOkCommit =(message)=>{
    let tipsAlert;
    const tipsProps={
      tipsContent:message,
      okClick(){
        // console.log('ok');
        // tipsAlert.close();
      },
      cancelClick(){
        console.log('cancel');
        dispatch(routerRedux.goBack());
        tipsAlert.close();
      },
    }
    return (
      tipsAlert = alert('', <NoTitleAlert {...tipsProps}/>, [])
    )
  }

  const isCommit =(data)=>{
    let isCommitAlert;
    const isCommitProps={
      tipsContent:'请确认是否提现',
      withdrawMoney:data.amount,
      okClick(){
        // console.log('ok');
        dispatch({
          type:'withdrawCash/postAmount',
          payload:{
            ...data
          }
        })
        isCommitAlert.close();
      },
      cancelClick(){
        isCommitAlert.close();
      },
    }
    return (
      isCommitAlert = commitAlert('', <IsCommitAlert {...isCommitProps}/>, [])
    )
  }

  if(messageTips && isShowTips){
    dispatch({
      type:'withdrawCash/querySuccess',
      payload:{
        isShowTips:false
      }
    })
    onOkCommit(messageTips);
  }

  return (

    <div style={{backgroundColor:'#fff'}}>
      <WithdrawCash {...withdrawCashProps}/>
      <ActivityIndicator
        toast
        text=""
        animating={loading}
      />
    </div>
  )
}

function mapStateToProps(state, ownProps) {
  return {
    loading: state.loading.global,
    withdrawCash: state.withdrawCash
  }
}
const IndexText = createForm()(Index);

export default connect(mapStateToProps)(IndexText);
